/*
 * Copyright Thoughtworks, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
@import "../../../global/common";

$stage-status-unknown: #fafafa;
$passed: #00c853;
$icon-size: 10px;

.stages-container {
  width: 100%;
  table-layout: fixed;

  .pipeline-instance-counter {
    width: 30px;
    text-align: end;
    word-wrap: break-word;
  }
}

.stage {
  height: 12px;
  color: $white;
  border: 1px solid $border-color;
  font-size: 8px;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;

  &::before {
    position: relative;
    left: calc(100% - 50% - 5px);
  }
}

.clickable {
  cursor: pointer;
}

.unknown {
  background: $stage-status-unknown;
}

.building {
  background: transparent url("../../../../../app/assets/images/building.gif") repeat-x;
}

.cancelled {
  color: $black;
  background: transparent url("../../../../../app/assets/images/building.png");

  @include icon-before($fa-var-ban, $icon-size, 1px);
}

.failed {
  background: $failed;

  @include icon-before($fa-var-exclamation-circle, $icon-size, 1px);
}

.failing {
  background: $failed url("../../../../../app/assets/images/failing.gif") repeat-x;
}

.passed {
  background: $passed;

  @include icon-before($fa-var-check, $icon-size, 1px);
}
